<template>
  <div class="setting-yly-container">
    <div style="margin: 20px 0">
      <el-button type="primary" @click="syncTemplate">同步模板</el-button>
    </div>
    <!-- 表格 -->
    <div style="margin-top: 15px">
      <el-table :data="templateData" style="width:100%" stripe>
        <el-table-column prop="name" label="模板标题" align="center"></el-table-column>
        <el-table-column prop="template_id" label="模板ID" align="center"></el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { getTemplate, syncTemplate } from '@/api/marketing'

export default {
  name: 'marketing-apptemplate',
  data() {
    return {
      templateData: []
    }
  },  
  mounted() {
    this.getTemplate();
  },
  methods: {
    /**
     * 获取模板
     */
    getTemplate() {
      getTemplate({key: this.$store.state.app.activeApp.saa_key}).then(res => {
        if(res.status === 200) {
          this.templateData = res.data;
        }else if(res.status === 204) {
          this.templateData = {}
        }else{
          this.$message.error(res.message);
        }
      })
    },
    /**
     * 同步模板
     */
    syncTemplate() {
      syncTemplate({key: this.$store.state.app.activeApp.saa_key}).then(res => {
        if(res.status === 200) {
          this.$message.success('同步成功！');
          this.getTemplate();
        }else{
          this.$message.error(res.message);
        }
      })
    }
  },
}
</script>

<style lang="scss" scoped>
.setting-yly-container{
  min-height: calc(100vh - 100px);
  margin: 20px;
  background-color: #fff;
  padding:25px;
  box-shadow: 0px 0px 4px 0px rgba(115, 115, 115, 0.2);
}
</style>